<template>
    <view>

        <view class="login-logo">
            <image :src="Config.OSS_HOST+Config.LOGO"></image>
        </view>

        <view class="login-box">
            <!-- 顶部文字 -->
            <view class="input">
                <view class="left">
                    <uni-icons type="person" size="20"></uni-icons>
                </view>
                <view class="right">
                    <input v-model="username" placeholder="请输入手机号"/>
                </view>
            </view>
            <view class="input" style="margin-top:20px;">
                <view class="left">
                    <uni-icons type="locked" size="20"></uni-icons>
                </view>
                <view class="right">
                    <uni-easyinput type="password" v-model="password" :inputBorder="false" placeholder="请输入密码"></uni-easyinput>
                </view>
            </view>
			<!-- #ifdef APP-PLUS -->
            <!-- <view class="agree">
                <checkbox-group @change="checkBoxChange" style="display: inline-block;">
                    <checkbox style="transform:scale(0.7)" value="1"/>
                </checkbox-group>
                我已阅读并同意
                <text @click.stop="Common.toUrl('/pages/index/agreement/index?id=76')">《服务协议》</text>
                &
                <text @click.stop="Common.toUrl('/pages/index/agreement/index?id=77')">《隐私政策》</text>
            </view> -->
			<!-- #endif -->

            <div class="uni-btn" type="primary" style="margin-top:30px;" @click="pwdLogin">登录
            </div>

            <!-- <view class="find-password">
                <text @click="Common.toUrl('/pages/user/login/SmsLogin?action=findPwd')">忘记密码？</text>
            </view>

            <view class="other">
                <view>其它登录</view>
            </view>

            <view class="other-btn">
                <view @click="Common.toUrl('/pages/user/login/SmsLogin')">
                    <uni-icons custom-prefix="iconfont" type="iconfont-shouji" size="40" :color="Config.UNI_GLOBAL_COLOR"></uni-icons>
                </view> -->
                <!-- #ifdef APP-PLUS -->
                <!-- <view @click="wxAppLogin()">
                    <uni-icons custom-prefix="iconfont" type="icon-weixin" size="40" :color="Config.UNI_GLOBAL_COLOR"></uni-icons>
                </view> -->
                <!-- #endif -->
            <!-- </view> -->
        </view>
    </view>
</template>

<script>
import {LoginApi} from '@/api/user/LoginApi.js'
import store from "../../../store";

export default {
    data() {
        return {
			Config: this.$Config,
			Common: this.$Common,
			Auth: this.$Auth,
			ShareUtil: this.$ShareUtil,
			State: this.$store.state,
			Dict: this.$Dict,

            username: "",
            password: "",
            agree: [1],

            shareObject:{}
        }
    },
    computed: {
        isUserName() {
            return this.username.length === 11;
        },
        isPwd() {
            return /^.{6,20}$/.test(this.password);
        },
        isAgree() {
            return this.agree.length > 0;
        }
    },
    onLoad() {
        if(this.Auth.isLogin()){
            uni.switchTab({
                url: "/pages/ucenter/index"
            })
        }

		this.shareObject  = {
			wxPersonalTitle: '会员登录-弹个信息',
			wxPersonalDesc: '免费注册，同城商家，同城服务，免费发布，同城商家推广，同城新闻、公益求助、求职招聘、租房卖房、家政保洁、二手物品买卖、拼车、顺风车出行、寻人寻物',
			wxSpaceDesc: '免费注册，同城商家，同城服务，免费发布，同城商家推广，同城新闻、公益求助、求职招聘、租房卖房、家政保洁、二手物品买卖、拼车、顺风车出行、寻人寻物',
			imgUrl: this.Config.OSS_HOST+"/static/logo_service.png",
			link: this.Config.SITE_DOMAIN+"/pages/user/login/PwdLogin"
		}
        // #ifdef H5 || MP-WEIXIN
        this.ShareUtil.share(this.shareObject)
        // #endif
    },
	onShow(e) {
	},
    methods: {
        checkBoxChange(e) {
            this.agree = e.detail.value
        },
        /**
         * 密码登录
         */
        pwdLogin() {
            if (!this.isUserName) {
                return uni.showToast({
                    title: '手机号应为11位',
                    icon: 'none'
                });
            }

            if (!this.isPwd) {
                return uni.showToast({
                    title: '密码在6-20个字符内',
                    icon: 'none'
                });
            }

			// #ifdef APP-PLUS
            if (!this.isAgree) {
                uni.showModal({
                    title: '提示',
                    content: '请阅读并勾选同意《服务协议》&《隐私政策》',
                    showCancel:false
                });

                return false
            }
			// #endif

            // 下边是可以登录
            LoginApi.passwordLogin({
                username: this.username,
                password: this.password
            }).then((token) => {
                this.Auth.setToken(token)
                this.$store.dispatch('user/getInfo').then(()=>{
					uni.reLaunch({
						url: '/pages/food/index'
					})
                })
            })
        },

        wxAppLogin(){
			let that = this
			
            if (!this.isAgree) {
                uni.showModal({
                    title: '提示',
                    content: '请阅读并勾选同意《服务协议》&《隐私政策》',
                    showCancel:false
                });

                return false
            }

            uni.showLoading({
                "title": "登录中...",
                "mask": true
            });
            uni.login({
                "provider": "weixin",
				"onlyAuthorize": true,
                success: (res) => {
                    //这里获取的是用户的code，用来换取 openid、unionid、session_key 等信息，再将信息丢给后台自己的登录业务就行了

                    // 下边是可以登录
                    LoginApi.wxLogin(res.code).then((response) => {
                        if (response.code === -3) {
							that.Auth.setWxOpenId(response.data)
                            this.Common.toUrl('/pages/ucenter/login/BindMobile')
                        } else {
                            this.Auth.setToken(response)
                            this.$store.dispatch('user/getInfo').then(() => {
                                uni.switchTab({
                                    url: "/pages/ucenter/index"
                                })
                            })
                        }
                        uni.hideLoading()
                    })
                },
				fail:(res)=> {
				}
            })
        }
    }
}
</script>

<style lang="scss" scoped>
page{overflow: hidden;}
.login-logo {text-align: center; margin-top:40px;}
.login-logo image{width:80px; height:80px;border-radius: 10px;}

.login-box { margin:40px 20px 20px 20px; padding-bottom:50px;}
.login-box .input { background: #FFF; display: flex; }
.login-box .input .left{ width:40px; display: flex; align-items: center;justify-content: center; }
.login-box .input .right{ flex:1;}
.login-box .input .right input{height:40px; line-height: 40px; padding-left:10px;}
::v-deep .login-box .input .right .uni-easyinput{height:40px; line-height: 40px;}
::v-deep .login-box .input .right .uni-input-placeholder{color:#808080; font-size: 14px;}
::v-deep .login-box .input .right .uni-easyinput__content{height:40px !important;line-height: 40px;}
::v-deep .login-box .input .right .uni-easyinput__content-input{height:40px !important;line-height: 40px;}

.login-box .submit-btn{height:44px; margin-top:64px; background: linear-gradient(90deg, #5EBBFB 0%, #0097FE 100%);
    color:#FFFFFF !important; border-radius: 22px; border:none;}

.login-box .agree {margin-top:30px; font-size: 12px; padding-left: 10px;}
.login-box .agree label {font-size: 12px;}
.login-box .agree text {font-size: 12px; color:#0084FE;}

.login-box .find-password { display: flex; margin-top:20px;justify-content: space-around; text-align:center; font-weight:bold;}
.login-box .find-password text{}

.other{border-top:1px solid #DDD; margin:50px 20px 0 20px; display: flex; justify-content: center; }
.other view{background: #f8f8f8; margin-top:-10px; padding:0 10px;}
.other-btn{display: flex; justify-content: space-evenly; margin-top:30px;}
</style>
